<template>
	<div class="left_model">
		<div class="left_model_item">
		    <Hsl></Hsl>
		</div>
		<div class="left_model_item">
			<Aomrs class="Aomrs"></Aomrs>
		</div>
		<div class="left_model_item">
			<At></At>
		</div>
      
	</div>	
</template>

<script>
	import Aomrs from './Aomrs.vue'
	import At from './AT.vue'
	import Hsl from './HSL.vue'
	export default {
		components: {
			Aomrs,At,
			Hsl
		},		
		data() {
			return {
				
			}
		},
		mounted() {
			
		},
		methods: {
		
		}
	}
</script>

<style lang="scss" scoped="">
	* {
		box-sizing: border-box;
	}	
	
	.left_model {
		width: 25%;
		position: absolute;
		height: calc(100% - 100px);
		background: rgba(45, 103, 146, .3);
		left: 0;
		top: 100px;
		z-index: 100;
		display: flex;
		flex-direction: column;
		.left_model_item {
			flex: 1;			
		}	
	}	
</style>